<template>
	<Row class="data-dictionary" style="padding:10px;">
		<Row>
			<Form label-position="top">
				<Row>
					<Col span="5">
					<FormItem label style="margin-bottom: 14px;">
						<DatePicker type="year" @on-change="yearChange" :value="formData.year" placeholder="年份" style="width: 90%"></DatePicker>
					</FormItem>
					</Col>
					<Col span="5">
					<FormItem label style="margin-bottom: 14px;">
						<Select clearable v-model="formData.month" style="width: 90%;" placeholder="月份">
							<Option v-for="item in 12" :value="item" :key="item">{{ item }}月</Option>
						</Select>
					</FormItem>
					</Col>
					<Col span="4" style="text-align: right;float: right;">
					<div class="button-s">
						<Button type="primary" style="margin-right: 15px" @click="searchBtn">搜索</Button>
						<Button type="primary" @click="exportRiskStatistics()">导出</Button>
					</div>
					</Col>
				</Row>

			</Form>
			</Col>
		</Row>
		<Row>
			<Card style="margin-bottom: 10px;background: rgba(245,248,252,1);border-radius: 4px;" dis-hover>
				<Row>
					<Row style="margin-bottom:10px;font-size: 16px;font-weight: 600;">
						Ⅰ级高风险总数 : {{statisticalData.riskCount}}个
					</Row>
					<Row style="">
						<Col span="6">涉及项目部数量 : {{statisticalData.proCount}}个</Col>
						<Col span="6">涉及区域数量 : {{statisticalData.orgRegion}}个</Col>
						<Col span="6">涉及工程公司数量 : {{statisticalData.orgCount}}个</Col>
					</Row>
				</Row>
			</Card>
		</Row>
		<Table ref="selection" border :columns="columns" :data="dictList" @on-select="selectRiado" @on-select-all="selectRiadoAll"
		 @on-select-cancel="selectCancel" @on-select-all-cancel="selectAllCancel">
			<template slot-scope="{ row, index }" slot="action">
				<span title="详情" class="button-class" type="text" @click="addBtn('details', row.reportTime, '督导报告详情')">详情</span>
			</template>
		</Table>
		<Page v-show="page.total>0" class="tab-page" :total="page.total" :current="page.current" :pageSizeOpts="pageSizeOpts" :page-size="page.pageSize"
		 @on-change="pageChange" @on-page-size-change="sizeChange" show-elevator show-sizer show-total />
	</Row>
</template>

<script>
	export default {
		name: 'dynamic-supervision-report',
		data() {
			return {
				userDetail: JSON.parse(localStorage.getItem('userList')),
				personType: JSON.parse(localStorage.getItem('personType')),
				dictList: [],
				formData: {
					year: "",
					month: ""
				},
				statisticalData: {},
				uploadList: [],
				columns: [{
						type: "selection",
						width: 60,
						align: "center",
					},
					{
						title: '序号',
						align: 'center',
						width: 70,
						render: (h, params) => {
							return h('span', params.index + (this.page.current - 1) * this.page.pageSize + 1)
						}
					},
					{
						title: '督导报告名称',
						key: 'name',
						align: 'center',
						tooltip:true
					},
					{
						title: '涉及区域数',
						key: 'orgRegion',
						align: 'center'
					},
					{
						title: '涉及项目数',
						key: 'proCount',
						align: 'center'
					},
					{
						title: '涉及工程公司数',
						key: 'orgCount',
						align: 'center'
					},
					{
						title: '风险总数',
						key: 'riskCount',
						align: 'center'
					},
					{
						title: '操作',
						align: 'center',
						width: 70,
						slot: 'action'
					}
				],
				pageSizeOpts:[10,20,50,100],
				page: {
					total: 0,
					current: 1,
					pageSize: 10,
					totalPage: 0
				},

			}
		},
		methods: {
			tabpaneBtn(e) {
				this.page.current = 1;
				this.page.currentPage = 10;
				this.formData.riskLevel = e;
				this.getWbsTabelList();
			},
			//搜索
			searchBtn() {
				this.page.current = 1;
				this.page.currentPage = 10;
				this.getWbsTabelList();
			},
			yearChange(date){
				this.formData.year = date;
				this.formData.month = "";
			},
			//列表
			getWbsTabelList() {
				this.dictList = [];
				this.page.total = 0;
				this.page.totalPage = 0;
				let param = {
					currentPage: this.page.current,
					pageSize: this.page.pageSize,
					whereMap: {
						"reportYear": this.formData.year || "",
						"reportMonth": this.formData.month || "",
					}
				};
				this.$api.ledgerQuery.getDynamicSupervisionReport(param).then(res => {
					if (res.code === 200) {
						this.dictList = res.data.data.resultObject;
						this.statisticalData = res.data.statistics;
						this.page.total = res.data.data.totalRecord || 0;
						this.page.totalPage = res.data.data.totalPage;
					} else {
						this.$Message.warning(res.message)
					}
				})
			},
			pageChange(current) {
				this.page.current = current
				this.getWbsTabelList(this.parentId)
			},
			sizeChange(size) {
				this.page.pageSize = size
				this.getWbsTabelList(this.parentId)
			},
			//全选
			selectRiadoAll(e) {
				this.uploadList = e
			},
			//全选取消
			selectAllCancel() {
				this.uploadList = []
			},
			//单选
			selectRiado(e) {
				this.uploadList = e
			},
			//取消某一项
			selectCancel(e) {
				this.uploadList.splice(e, 1)
			},
			exportRiskStatistics() {
				let uploadList = [];
				this.uploadList.forEach(val => {
					uploadList.push(val.reportTime)
				})
				if(uploadList.length<1){
					this.$Message.warning("请先选择要下载的文件");
					return false;
				}
				let param = {
					whereMap: {
						reportTimeList: uploadList
					}
				};
				this.$api.ledgerQuery.exportReport(param).then((data, status, headers, config) => {
					if (uploadList.length > 1) {
						var blob = new Blob([data], {
							type: "application/octet-stream"
						});
						if('msSaveOrOpenBlob' in navigator){
							window.navigator.msSaveOrOpenBlob(blob,  title + "十四局各区域高风险项目督导推送报告.zip");
							return;
						}
						if ('download' in document.createElement('a')) {
							var objectUrl = URL.createObjectURL(blob);
							var a = document.createElement('a');
							document.body.appendChild(a);
							a.setAttribute('style', 'display:none');
							a.setAttribute('href', objectUrl);
							a.setAttribute('download', "十四局各区域高风险项目督导推送报告.zip");
							a.click();
							URL.revokeObjectURL(objectUrl);
						} else {
							navigator.msSaveBlob(blob, "十四局各区域高风险项目督导推送报告.zip");
						}
					} else {
						let blob = new Blob([data], {
							type: "application/vnd.ms-excel"
						});
						if('msSaveOrOpenBlob' in navigator){
							window.navigator.msSaveOrOpenBlob(blob,this.uploadList[0].name+".xlsx");
							return;
						}
						if ('download' in document.createElement('a')) {
							let objectUrl = URL.createObjectURL(blob);
							let a = document.createElement('a');
							document.body.appendChild(a);
							a.setAttribute('style', 'display:none');
							a.setAttribute('href', objectUrl);
							a.setAttribute('download', this.uploadList[0].name+".xlsx");
							a.click();
							URL.revokeObjectURL(objectUrl);
						} else {
							navigator.msSaveBlob(blob, this.uploadList[0].name+".xlsx");
						}
					}

				})

			},

			addBtn(type, id, name) {
				this.$router.push({
					path: `dynamic-supervision-report/${type}/${id}/${name}`,
				})
			}
		},
		mounted() {
			this.getWbsTabelList();
		},
		activated() {
			// this.getWbsTabelList();
		}
	}
</script>

<style lang="scss" scoped>
	.data-dictionary {
		height: calc(100% - 0px);

		.col-height100 {
			height: 100%;
			border-right: 1px solid #ebeef1;
			overflow: auto;

			p {
				padding: 10px;
			}
		}

		.col-main {
			padding: 10px;

			.button-s {
				margin-bottom: 15px;

				button:not(:last-child) {
					margin-right: 15px;
				}
			}
		}

		.tabs_box {
			color: #f00 !important;
		}
	}
</style>
